跳到主要内容

Rive 标记语言(RML)

Rive 标记语言(RML)是 Rive 文件的文本表示。它让你可以把 Rive 内容当作代码来创建和修改,从而可以用编码代理和其他基于文本的工作流构建 Rive 文件,而不必只在编辑器中工作。

RML 用 XML 描述 Rive 文件中的对象和关系。每个元素都是一种 Rive 类型,每个属性都是该类型的一项属性,嵌套元素则把它们链接在一起。名称与编辑器使用的相同,因此没有另一套需要学习的 RML 对象模型。

一份 .rml 文件描述整个 Rive 文件。Rive CLI 会把它编译成供 Rive 运行时使用的 .riv 文件,或可在 Rive 编辑器中打开并继续编辑的 .rev 文件。

编码代理协作来创建 RML、编译、检查结果,并迭代你的 Rive 文件。

示例

下面的示例展示 RML 如何把熟悉的 Rive 概念(画板、形状、填充、动画和状态机)映射为 XML。

scene.rml
<Rive version="1" kind="fragment">
<Artboard defaultStateMachineId="0:7" width="500" height="500" name="Artboard" id="0:2">
<Fill name="Background">
<SolidColor colorValue="FF1D1D1D" name="Color"/>
</Fill>

<Shape x="250" y="250" name="Triangle" id="0:14">
<Triangle originX="0.5" originY="0.5" width="220" height="200" name="Path"/>
<Fill name="Fill">
<SolidColor colorValue="FF57A5E0" name="Color"/>
</Fill>
</Shape>

<!-- State Machine -->
<StateMachine name="State Machine 1" id="0:7">
<StateMachineLayer name="Layer 1" id="0:8">
<AnyState x="200" y="-120"/>
<ExitState x="400" y="-120"/>
<EntryState>
<StateTransition stateToId="0:12"/>
</EntryState>
<AnimationState x="200" animationId="0:6" id="0:12"/>
</StateMachineLayer>
</StateMachine>

<!-- Animation -->
<LinearAnimation loopValue="loop" duration="120" name="Spin" id="0:6">
<KeyedObject objectId="0:14">
<KeyedProperty propertyKey="15">
<KeyFrameDouble value="0" interpolationType="linear"/>
<KeyFrameDouble value="6.2831855" interpolationType="linear" frame="120"/>
</KeyedProperty>
</KeyedObject>
</LinearAnimation>
</Artboard>
</Rive>

RML 如何映射到 Rive

每个文档都包在单一的 Rive 根元素中。它有两个必需属性:version(RML 格式版本,目前为 1),以及 kind(你自己编写的项目文件为 fragment,Rive 编辑器导出的自包含文档为 bundle)。Rive 必须是第一个也是唯一的顶层元素,没有它 CLI 会拒绝该文档。

在该根元素内部,RML 遵循 Rive 文件的结构。画板包含其场景内容,而资源、视图模型、转换器和枚举作为根元素与画板并列。

fragment 从不声明 Backboard。编辑器保存在那里的内容(例如默认画板和发布设置)属于项目配置,因此放在 rive.yaml 中。构建会根据这些键创建 Backboard。只有 bundle 才会携带 Backboard 元素。

嵌套反映 Rive 对象之间的关系。在上面的示例中,Shape 包含一个 Triangle 路径和一个 Fill。属性属于对应的 Rive 类型,因此变换位置(xy)属于 Shape,而 widthheight 属于 Triangle

动画引用它们所改变的对象和属性。这里,KeyedObject objectId="0:14" 指向名为 "Triangle" 的形状,而 propertyKey="15" 标识其旋转属性。状态机引用该动画,画板上的 defaultStateMachineId="0:7" 使文件加载时播放该状态机。

以下章节使用 Rive CLI 查阅 RML 类型、编译文件并检查结果。参见 Rive CLI 了解如何安装 CLI 以及可用命令。

编写 RML

ID 与引用

当一个元素需要引用另一个元素时,RML 使用 ID。例如,动画用 objectId 标识它要动画的对象,Animation State 用 animationId 标识它要播放的动画。

ID 是两个用冒号分隔的数字,例如 0:1214:11981。每个 ID 必须在整个文档中唯一。只有当其他元素引用某元素时,该元素才需要 id

引用使用以 Id 结尾的属性,例如 styleIdanimationIdobjectId。嵌套会自动创建其中许多关系,因此通常不必自己写引用。运行 rive docs format 可以查看哪些引用由嵌套创建。

值格式

类型写法
颜色ARGB 十六进制,不含 #colorValue="FFFF5A3C"
布尔"true" / "false"
枚举名称或其整数:layoutWidthScaleType="fill"
旋转弧度。一整圈是 6.2831855
动画时间帧,按动画的 fps(默认 60)。过渡时长是毫秒。

检查你的工作

三项检查,彼此不能互相替代:

rive <dir> --verify              # 能否编译?(RML、Luau 和着色器)
rive inspect <dir> --json # 构建出了什么,`problems` 是否为空?
rive <dir> --screenshot=out.png # 看起来对不对?

干净的构建只能证明文件能编译,不能证明它的行为或外观符合预期。

inspect 查看构建出了什么,用截图查看它长什么样。指向错误属性的绑定,或渲染不可见的形状,都能通过前两项检查。参见示例(Examples)

RML 参考

RML 包含数百种 Rive 类型和属性。与其记忆或猜测它们的名称,不如用 CLI 查阅 schema:

rive schema Rectangle              # 属性、默认值、枚举名、属性键
rive schema --search gradient # 按名称查找类型
rive schema Shape --animatable # 可打关键帧的属性
rive schema Shape --bindable # 可数据绑定的属性

对于更宽泛的 RML 概念和模式,使用 CLI 附带的 RML 参考:

rive docs                    # 参考索引
rive docs format # RML 结构与格式
rive docs --list # 列出可用主题
rive docs --search gradient # 搜索所有主题

参考覆盖布局、数据绑定、状态机、文本、绘制、绑定(rigging)、变换、缓动和资源等主题。rive docs gotchas 涵盖常见问题,包括那些可能静默失败的问题。

看完还有疑问?进群交流下!
与众多 Rive 创作者、开发者一起交流探讨与答疑解惑。
加入交流群